html {
  height: 100%;
}
html body {
  height: 100%;
  background-color: #f4f4f4;
}
html body .index {
  max-width: 750px;
  min-width: 300px;
  margin: 0 auto;
  position: relative;
}
html body .index .topbar {
  width: 100%;
  height: 1.066666rem;
  background-color: #fff;
  text-align: center;
}
html body .index .topbar a {
  float: left;
  display: block;
  width: 10%;
  height: 100%;
}
html body .index .topbar a i {
  display: block;
  font-size: 0.466666rem;
  line-height: 1.066666rem;
}
html body .index .topbar p {
  float: left;
  display: block;
  width: 80%;
  margin-right: 10%;
  font-size: 0.466666rem;
  line-height: 1.066666rem;
}
html body .index .content {
  width: 94%;
  margin: 0.3rem auto;
}
html body .index .content ul {
  display: block;
  width: 100%;
  border-radius: 5px;
  overflow: hidden;
}
html body .index .content ul li {
  display: table;
  width: 95%;
  height: 1.44rem;
  padding-left: 5%;
  background-color: #fff;
  border-bottom: 1px solid #ccc;
}
html body .index .content ul li p {
  display: table-cell;
  font-size: 0.4rem;
  vertical-align: middle;
  width: 80%;
}
html body .index .content ul li i {
  display: table-cell;
  font-size: 0.4rem;
  vertical-align: middle;
  text-align: center;
  color: #ccc;
}
html body .index .content ul li:last-of-type {
  border: none;
}
html body .index .content ul .active {
  border: none;
  background-color: #1ba7c2;
  color: #fff;
  border-radius: 5px;
}
html body .index .content ul .active i {
  color: #fff;
}
html body .index .content .btn {
  width: 93%;
  letter-spacing: 0.2em;
  padding-left: 2%;
  line-height: 2.5;
  margin: 1.5rem auto 0.5rem;
  font-size: 0.48rem;
  color: #fff;
  text-align: center;
  background-color: #1ba7c2;
  border-radius: 5px;
}
